{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="">
        <meta name="author" content="">

        <link rel="shortcut icon" href="{% static '' %}velonic/img/favicon_1.ico">

        <title>个人档案</title>

        <!-- Bootstrap core CSS -->
        <link href="{% static '' %}velonic/css/bootstrap.min.css" rel="stylesheet">
        <link href="{% static '' %}velonic/css/bootstrap-reset.css" rel="stylesheet">

        <!--Animation css-->
        <link href="{% static '' %}velonic/css/animate.css" rel="stylesheet">

        <!-- sweet alerts -->
        <link href="{% static '' %}velonic/css/sweet-alert.min.css" rel="stylesheet">

        <!--Icon-fonts css-->
        <link href="{% static '' %}velonic/css/font-awesome.css" rel="stylesheet" />
        <link href="{% static '' %}velonic/css/ionicons.min.css" rel="stylesheet" />
        <link href="{% static '' %}velonic/css/material-design-iconic-font.min.css" rel="stylesheet" />

        <!-- Custom styles for this template -->
        <link href="{% static '' %}velonic/css/style.css" rel="stylesheet">
        <link href="{% static '' %}velonic/css/helper.css" rel="stylesheet">
        

        <!-- HTML5 shim and Respond.js IE8 support of HTML5 tooltipss and media queries -->
        <!--[if lt IE 9]>
          <script src="js/html5shiv.js"></script>
          <script src="js/respond.min.js"></script>
        <![endif]-->


    </head>


    <body>

        <!-- Aside Start-->
        {% include 'velonic/block/side_nav.html' %}
        <!-- Aside Ends-->


        <!--Main Content Start -->
        <section class="content">
            
            <!-- Header -->
            {% include 'velonic/block/header.html' %}
            <!-- Header Ends -->


            <!-- Page Content Start -->
            <!-- ================== -->

            <div class="wraper container-fluid">
                <div class="row">
                    <div class="col-sm-12">
                        <div class="bg-picture" style="background-image:url('{% static '' %}velonic/img/bg_6.jpg')">
                          <span class="bg-picture-overlay"></span><!-- overlay -->
                          <!-- meta -->
                          <div class="box-layout meta bottom">
                            <div class="col-sm-6 clearfix">
                              <span class="img-wrapper pull-left m-r-15">{% if user_profile.avatar %}<img src="/uploads/{{ user_profile.avatar }}"  style="width:64px" class="br-radius">{% else %}<img src="{% static '' %}velonic/img/avatar-2.jpg" alt="" style="width:64px" class="br-radius">{% endif %}</span>
                              <div class="media-body">
                                <h3 class="text-white mb-2 m-t-10 ellipsis">{{ user_profile.name }}</h3>
                                <h5 class="text-white"> 跨境电商 (玩具类目)/ 淘宝大学讲师</h5>
                              </div>
                            </div>
                            <div class="col-sm-6">

                              <div class="pull-right">
                                <div class="dropdown">
                                    <a data-toggle="dropdown" class="dropdown-toggle btn btn-primary" href="#"> 关注 <span class="caret"></span></a>
                                    <ul class="dropdown-menu dropdown-menu-right" role="menu">
                                        <li><a href="#">Poke</a></li>
                                        <li><a href="#">私信</a></li>
                                        <li class="divider"></li>
                                        <li><a href="#">取消关注</a></li>
                                    </ul>
                                </div>
                              </div>
                            </div>
                          </div>
                          <!--/ meta -->
                        </div>
                    </div>
                </div>

                <div class="row m-t-30">
                    <div class="col-sm-12 col-md-9">
                        <div class="panel panel-default p-0">
                            <div class="panel-body p-0"> 
                                <ul class="nav nav-tabs profile-tabs">
                                    <li class="active"><a data-toggle="tab" href="#edit-profile">账号设置</a></li>
                                    <li class=""><a data-toggle="tab" href="#user-activities">最新动态</a></li>
                                    <li class=""><a data-toggle="tab" href="#aboutme">联系方式</a></li>
                                    <li class=""><a data-toggle="tab" href="#projects">任务管理</a></li>
                                </ul>

                                <div class="tab-content m-0">

                                    <!-- settings -->
                                <div id="edit-profile" class="tab-pane active">
                                    <div class="user-profile-content">
                                        <form role="form" class="form-horizontal" method="POST" enctype="multipart/form-data">
                                        {% csrf_token %}
                                            <h3 style="text-align: center;">基本资料</h3>
                                            <div class="form-group">
                                                {% if user_profile.avatar %}
                                                <img src="/uploads/{{ user_profile.avatar }}" alt="" height="150" width="150"/>
                                                    {% else %}
                                                    <img src="{% static '' %}velonic/img/avatar-2.jpg" alt="" height="150" width="150"/>
                                                {% endif %}
                                                <br/>
                                                <label for="avatar">头  像</label>

                                                <input class="input-file" id="avatar" name="avatar" type="file">
                                            </div>

                                            <div class="form-group">
                                                <label for="FullName">姓  名</label>
                                                <input type="text" value="{{ user_profile.name }}" id="FullName" name="name" class="form-control">
                                            </div>
                                            <div class="form-group">
                                                <label for="tel">手机</label>
                                                <input type="text" {% if user_profile.tel %} value="{{ user_profile.tel }}"{% endif %} id="tel" name="tel" class="form-control">
                                            </div>
                                            <div class="form-group">
                                                <label for="Email">Email</label>
                                                <input type="email" {% if user_profile.email %} value="{{ user_profile.email }}"{% endif %} name="email"  id="Email" class="form-control">
                                            </div>
                                        <h3 style="text-align: center;">店小秘店铺设置</h3>
                                            <div class="form-group">
                                                <label for="DXMUsername">用户名</label>
                                                <input type="text" placeholder="" id="DXMUsername" name="dxm_username" class="form-control" {% if user_profile.dxm_username %} value="{{ user_profile.dxm_username }}"{% endif %}>
                                            </div>
                                            <div class="form-group">
                                                <label for="DXMPassword">密  码</label>
                                                <input type="text" placeholder="" name="dxm_password" class="form-control" {% if user_profile.dxm_password %} value="{{ user_profile.dxm_password }}"{% endif %}>
                                            </div>
                                            <button class="btn btn-primary" type="submit">保存</button>
                                        </form>
                                    </div>
                                </div>


                                    <div id="aboutme" class="tab-pane">
                                    <div class="profile-desk">
                                        <h1>{{ user_profile.name }}</h1>
                                        <span class="designation">跨境电商 (玩具类目)/ 淘宝大学讲师</span>
                                        <p>
                                            路曼曼其修远兮，吾将上下而求索.非学无以广才，非志无以成学，不要为小事遮住视线，我们还有更大的世界。
                                        </p>
                                        <a class="btn btn-primary m-t-20" href="#"> <i class="fa fa-check"></i> 关注</a>

                                        <table class="table table-condensed">
                                            <thead>
                                                <tr>
                                                    <th colspan="3"><h3>联系方式</h3></th>
                                                </tr>
                                            </thead>
                                            <tbody>
                                                <tr>
                                                    <td><b>网站</b></td>
                                                    <td>
                                                    <a href="#" class="ng-binding">
                                                        www.example.com
                                                    </a></td>
                                                </tr>
                                                <tr>
                                                    <td><b>邮箱</b></td>
                                                    <td>
                                                    <a href="" class="ng-binding">
                                                        {{ user_profile.email }}
                                                    </a></td>
                                                </tr>
                                                <tr>
                                                    <td><b>电话</b></td>
                                                    <td class="ng-binding">{{ user_profile.tel }}</td>
                                                </tr>
                                                <tr>
                                                    <td><b>QQ</b></td>
                                                    <td>
                                                    <a href="" class="ng-binding">
                                                        12345678
                                                    </a></td>
                                                </tr>
                                            </tbody>
                                        </table>


                                    </div> <!-- end profile-desk -->



                                </div> <!-- about-me -->


                                <!-- Activities -->
                                <div id="user-activities" class="tab-pane">
                                    <div class="timeline-2">
                                        <div class="time-item">
                                            <div class="item-info">
                                                <div class="text-muted">5 分钟前</div>
                                                <p><strong><a href="#" class="text-info">John Doe</a></strong> 上传图片 <strong>"DSC000586.jpg"</strong></p>
                                            </div>
                                        </div>

                                        <div class="time-item">
                                            <div class="item-info">
                                                <div class="text-muted">30 分钟前</div>
                                                <p><a href="" class="text-info">Lorem</a> 采集256条产品.</p>
                                                <p><em>采集速卖通“halloween decoration”相关产品150条</em></p>
                                            </div>
                                        </div>

                                        <div class="time-item">
                                            <div class="item-info">
                                                <div class="text-muted">59 分钟前</div>
                                                <p><a href="" class="text-info">Jessi</a> 增加5个<a href="#" class="text-success">采集任务</a>.</p>
                                                <p><em>增加了"[wall sticker],[rc nitro aluminium],[одежда для собак],[dog underwear]"</em></p>
                                            </div>
                                        </div>

                                        <div class="time-item">
                                            <div class="item-info">
                                                <div class="text-muted">2 小时前</div>
                                                <p><strong><a href="#" class="text-info">修改个人资料</a></strong>店小秘账号信息</p>
                                            </div>
                                        </div>

                                        <div class="time-item">
                                            <div class="item-info">
                                                <div class="text-muted">5 小时前</div>
                                                <p><a href="" class="text-info">Lorem</a> 物流数据更新完毕.</p>
                                            </div>
                                        </div>

                                        <div class="time-item">
                                            <div class="item-info">
                                                <div class="text-muted">2 天前</div>
                                                <p><a href="" class="text-info">Jessi</a> 升级为<a href="#" class="text-success">VIP用户</a>.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>




                                <!-- profile -->
                                <div id="projects" class="tab-pane">
                                    <div class="row m-t-10">
                                        <div class="col-md-12">
                                            <div class="portlet"><!-- /primary heading -->
                                                <div id="portlet2" class="panel-collapse collapse in">
                                                    <div class="portlet-body">
                                                        <div class="table-responsive">
                                                            <table class="table">
                                                                <thead>
                                                                    <tr>
                                                                        <th>#</th>
                                                                        <th>任务名称</th>
                                                                        <th>开始日期</th>
                                                                        <th>截至日期</th>
                                                                        <th>状态</th>
                                                                        <th>分配</th>
                                                                    </tr>
                                                                </thead>
                                                                <tbody>
                                                                    <tr>
                                                                        <td>1</td>
                                                                        <td>halloween decoration</td>
                                                                        <td>01/01/2015</td>
                                                                        <td>07/05/2015</td>
                                                                        <td><span class="label label-info">进行中</span></td>
                                                                        <td>Coderthemes</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>2</td>
                                                                        <td>тюль для окон</td>
                                                                        <td>01/01/2015</td>
                                                                        <td>07/05/2015</td>
                                                                        <td><span class="label label-success">等待中</span></td>
                                                                        <td>Coderthemes</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>3</td>
                                                                        <td>rc nitro aluminium</td>
                                                                        <td>01/01/2015</td>
                                                                        <td>07/05/2015</td>
                                                                        <td><span class="label label-pink">已完成</span></td>
                                                                        <td>Coderthemes</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>4</td>
                                                                        <td>pet winter coat</td>
                                                                        <td>01/01/2015</td>
                                                                        <td>07/05/2015</td>
                                                                        <td><span class="label label-purple">进行中</span></td>
                                                                        <td>Coderthemes</td>
                                                                    </tr>
                                                                    <tr>
                                                                        <td>5</td>
                                                                        <td>material escolar</td>
                                                                        <td>01/01/2015</td>
                                                                        <td>07/05/2015</td>
                                                                        <td><span class="label label-warning">待分配</span></td>
                                                                        <td>Coderthemes</td>
                                                                    </tr>
                                                                    
                                                                </tbody>
                                                            </table>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div> <!-- /Portlet -->
                                        </div>
                                    </div>
                                </div>
                            </div>
             
                        </div> 
                    </div>
                </div>
            </div>
            


        </div>

        <!-- Page Content Ends -->
        <!-- ================== -->

        <!-- Footer Start -->
        {% include 'velonic/block/footer.html' %}
        <!-- Footer Ends -->



    </section>
    <!-- Main Content Ends -->
        




    <!-- js placed at the end of the document so the pages load faster -->
        <script src="{% static '' %}velonic/js/jquery.js"></script>
        <script src="{% static '' %}velonic/js/bootstrap.min.js"></script>
        <script src="{% static '' %}velonic/js/pace.min.js"></script>
        <script src="{% static '' %}velonic/js/modernizr.min.js"></script>
        <script src="{% static '' %}velonic/js/wow.min.js"></script>
        <script src="{% static '' %}velonic/js/jquery.scrollTo.min.js"></script>
        <script src="{% static '' %}velonic/js/jquery.nicescroll.js" type="text/javascript"></script>

        <script src="{% static '' %}velonic/js/jquery.app.js"></script>



    {% include 'velonic/block/footer_comm.html' %}


  </body>
</html>
